<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 原型链继承
        function Parent(){
            this.name = 'parent'
        }
        Parent.prototype.getName = function(){
            console.log('我是父类', this.name)
            this.name = 'lt'
        }

        function Child(){
            this.age = 18
        }
        Child.prototype = new Parent()

        const child = new Child()
        child.getName()

        /*
            优点: 继承方法纯粹， 直接让子类的原型指向父类实例
            缺点: 1. 当父类被修改后所有的子类继承方法都会被修改
                  2. 创建子类实例时， 不能向父类构造函数传参
        */

        // 构造函数继承
        function Parent1(name){
            this.name = name
        }

        Parent1.prototype.getName = function(){
            console.log('我是父类', this.name)
        }

        function Child1(name){
            Parent1.call(this, name)
        }
        const child1 = new Child1('lt')
        console.log(child1.name)

        /*
            优点: 1. 创建子类实例时， 可以向父类构造函数传参
                  2. 子类实例之间不会相互影响
            缺点: 1. 只能继承父类实例的属性和方法， 不能继承父类原型上的属性和方法
        */

        // 组合继承
        function Parent2(name){
            this.name = name
        }
        Parent2.prototype.getName = function(){
            console.log('我是父类', this.name)
        }

        function Child2(name){
            Parent2.call(this, name)
        }
        Child2.prototype = new Parent2()
        Child2.prototype.constructor = Child2

        const child2 = new Child2('lt')
        child2.getName()
        /*
            优点: 1. 创建子类实例时， 可以向父类构造函数传参
                  2. 子类实例之间不会相互影响
                  3. 可以继承父类实例的属性和方法， 也可以继承父类原型上的属性和方法
            缺点: 1. 父类构造函数会被调用两次
        */



    </script>
</body>
</html>